<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
    <link href="css/首页.css" rel="stylesheet" type="text/css">
    <script src="js/jquery-1.6.4.js" type="text/javascript"></script>
<!--    <script src="js/jquery.min.js" type="text/javascript"></script>-->
    <script src="js/首页.js" type="text/javascript"></script>
</head>
<body>
<header class="w">
    <div class="logo">
        <img src="image/logo.png">
    </div>
    <div class="nav">
        <ul>
            <li><a href="login.html">登录</a></li>
            <li><p>|</p></li>
            <li><a href="#">下载</a></li>
        </ul>
    </div>
</header>
<div class="w">
<!--    左-->
    <div id="left" class="left clear-fix">
        <div class="block"></div>
        <div class="cir-box">
            <a id="a_shouye" class="cir-title" style="line-height: 50px">首页</a>
            <button id="shouye" class="cir-btn" onclick="click_1()" style="opacity: 80%"></button>
        </div>
        <div class="link"></div>
        <div class="cir-box">
            <a class="cir-title">Plog云村</a>
            <button id="yuncun" class="cir-btn" onclick="click_2()"></button>
        </div>
        <div class="link"></div>
        <div class="cir-box">
            <a class="cir-title">云逛冬奥</a>
            <button id="yunguang" class="cir-btn" onclick="click_3()"></button>
        </div>
        <div class="link"></div>
        <div class="cir-box">
            <a class="cir-title">云上手账</a>
            <button id="shouzhang" class="cir-btn" onclick="click_4()"></button>
        </div>
        <div class="link"></div>
        <div class="cir-box">
            <a class="cir-title">冬奥周边</a>
            <button id="zhoubian" class="cir-btn" onclick="click_5()"></button>
        </div>
        <div class="link"></div>
        <div class="cir-box">
            <a class="cir-title">吃喝玩乐</a>
            <button id="chihe" class="cir-btn" onclick="click_6()"></button>
        </div>
        <div class="link"></div>
        <div class="cir-box">
            <a class="cir-title">联系我们</a>
            <button id="lianxi" class="cir-btn" onclick="click_7()"></button>
        </div>
        <div class="block"></div>
    </div>
<!--    右-->
    <div id="right" class="right" onscroll="scrollEvt()">
<!--        首页-->
        <div class="in-block">
            <div class="shouye">
                <img src="image/index_main.png">
                <div>
                    <p style="font-size: 30px">序言</p>
                    <br>
                    <br>
                    <p>本网站为产品”一键Plog“网页分享版，”基于人工智能的Plog图文自动生成应用“是一款通过打卡分享，智能识别和自动生成等功能来满足用户分享欲的旅游打卡类小程序。</p>
                    <br>
                    <p>项目进行过程中，第一阶段我们以冬奥为例，通过”冬奥+AI“ 、”打 卡+Plog“的形式向用户展现冬奥的运动文化以及中国运动员的奋斗精神。我们用产品的主打功能来宣传冬奥，旨在为冬奥成功举办添砖加瓦。</p>
                </div>
            </div>
        </div>
<!--        Plog云村-->
        <div class="in-block">
            <div class="yuncun">
                <header>Plog云村</header>
                <div>
                    <button id="turn-left" class="turn turn-left"></button>
                </div>
<!--                用户-->
                <div class="yuncun-yh">
                    <div id="yh-1" class="side mask-wrapper">
                        <img src="image/plog.JPG">
                        <div class="mask-inner">
                            <p>冬梦兔</p>
                        </div>
                    </div>
                    <div id="yh-2" class="middle mask-wrapper">
                        <img src="image/plog.JPG">
                        <div class="mask-inner">
                            <p>冬梦兔</p>
                        </div>
                    </div>
                    <div id="yh-3" class="side mask-wrapper">
                        <img src="image/plog.JPG">
                        <div class="mask-inner">
                            <p>冬梦兔</p>
                        </div>
                    </div>
                </div>

                <div>
                    <button id="turn-right" class="turn turn-right"></button>
                </div>
                <footer>
                    <button class="yuncun-more">
                        <a href="more_plog.html">点击查看更多分享</a></button>
                </footer>
            </div>
        </div>
<!--        云逛冬奥-->
        <div class="in-block">
            <div class="yunguang">
                <div class="yun-map">
                    <img src="image/map.png">
                </div>
                <footer>
                    <button class="yuncun-more">
                        <a href="more_map.html">点击了解场馆详情</a></button>
                </footer>
            </div>
        </div>
<!--        云上手账-->
        <div class="in-block">
            <div class="yuncun">
                <header>云上手账</header>
                <div>
                    <button id="turn-left" class="turn turn-left"></button>
                </div>
                <!--                用户-->
                <div class="yuncun-yh">
                    <div id="yh-1" class="side mask-wrapper">
                        <img src="image/plog.JPG">
                        <div class="mask-inner">
                            <p>冬梦兔</p>
                        </div>
                    </div>
                    <div id="yh-2" class="middle mask-wrapper">
                        <img src="image/手账/IMG_0319(20210201-230812).JPG">
                        <div class="mask-inner">
                            <p>冬梦兔</p>
                        </div>
                    </div>
                    <div id="yh-3" class="side mask-wrapper">
                        <img src="image/plog.JPG">
                        <div class="mask-inner">
                            <p>冬梦兔</p>
                        </div>
                    </div>
                </div>

                <div>
                    <button id="turn-right" class="turn turn-right"></button>
                </div>
                <footer>
                    <button class="yuncun-more">
                        <a href="more_shouzhang.html">点击查看更多分享</a></button>
                </footer>
            </div>
        </div>
<!--        冬奥周边-->
        <div class="in-block">
            <div class="yuncun">
                <header>冬奥周边</header>
                <div>
                    <button id="turn-left" class="turn turn-left"></button>
                </div>
                <!--                用户-->
                <div class="yuncun-yh">
                    <div id="yh-1" class="side mask-wrapper">
                        <img src="image/周边/帽子/11.JPG">
                        <div class="mask-inner">
                            <p>帽子</p>
                        </div>
                    </div>
                    <div id="yh-2" class="middle mask-wrapper">
                        <img src="image/周边/手套.JPG">
                        <div class="mask-inner">
                            <p>手套</p>
                        </div>
                    </div>
                    <div id="yh-3" class="side mask-wrapper">
                        <img src="image/周边/衣服/20.JPG">
                        <div class="mask-inner">
                            <p>T恤</p>
                        </div>
                    </div>
                </div>

                <div>
                    <button id="turn-right" class="turn turn-right"></button>
                </div>
                <footer>
                    <button class="yuncun-more">
                        <a href="more_zhoubian.html">点击查看更多分享</a></button>
                </footer>
            </div>
        </div>
<!--        吃喝玩乐-->
        <div class="in-block">
            <div class="yuncun">
                <header>吃喝玩乐</header>
                <div>
                    <button id="turn-left" class="turn turn-left"></button>
                </div>
                <!--                用户-->
                <div class="yuncun-yh">
                    <div id="yh-1" class="side mask-wrapper">
                        <img src="image/joy/3.jpg">
                        <div class="mask-inner">
                            <p>冬梦兔</p>
                        </div>
                    </div>
                    <div id="yh-2" class="middle mask-wrapper">
                        <img src="image/joy/9.jpg">
                        <div class="mask-inner">
                            <p>冬梦兔</p>
                        </div>
                    </div>
                    <div id="yh-3" class="side mask-wrapper">
                        <img src="image/joy/11.jpg">
                        <div class="mask-inner">
                            <p>冬梦兔</p>
                        </div>
                    </div>
                </div>

                <div>
                    <button id="turn-right" class="turn turn-right"></button>
                </div>
                <footer>
                    <button class="yuncun-more">
                        <a href="more_joy.html">点击查看更多分享</a></button>
                </footer>
            </div>
        </div>
<!--        联系我们-->
        <div class="in-block">
            <div class="lianxi">
                <p style="font-size: 40px">联系我们</p>
                <br>
                <br>
                <br>
                <br>
                <p>微信公众号：一键Plog</p><br>
                <p>电话：123456789</p><br>
                <p>邮箱：123456789@123.com</p>
                <p></p>
            </div>

        </div>
    </div>
</div>
</body>
</html>